import { ResultPage, Card } from "antd-mobile";
import { List } from "antd-mobile";
import { SetOutline } from "antd-mobile-icons";
import { useNavigate } from "react-router-dom";
import vipimg from "../../assets/会员.png";
import { Image } from "antd";
import one from "../../assets/在线问诊.png";
import two from "../../assets/健康建档.png";
import three from "../../assets/用药建议.png";
import four from "../../assets/优选订单.png";
import five from "../../assets/我的医生.png";
import six from "../../assets/随访计划.png";

function Index() {
  const nav = useNavigate();
  const quickActions = [
    { key: "consult", title: "在线问诊", icon: one },
    { key: "record", title: "健康档案" },
    { key: "med", title: "用药建议" },
    { key: "best", title: "优选订单" },
    { key: "doctor", title: "我的医生" },
    { key: "follow", title: "随访计划" },
  ];
  return (
    <div style={{ width: "100%", height: "100%", backgroundColor: "#f5f5f5" }}>
      <ResultPage status="" title="我的" description="">
        <div style={{}}>
          <Image
            style={{ borderRadius: "40px" }}
            width={40}
            height={40}
            src="error"
            fallback=""
          />
          admin
          <SetOutline
            style={{ position: "absolute", right: "0", fontSize: "30" }}
            onClick={() => nav("/set")}
          />
        </div>
        <img
          src={vipimg}
          alt=""
          style={{ width: "100vw", left: "0", position: "absolute" }}
          onClick={() => nav("/vip")}
        />
        <ResultPage.Card
          style={{
            height: 64,
            padding: 8,
            backgroundColor: "#f2f2f2",
            marginTop: "30px",
          }}
        >
          <div
            style={{
              display: "flex",
              margin: "5px",
              alignItems:'center',
              justifyContent: "space-around",
            }}
          >
            <Card
              style={{               
                backgroundColor: "white",
                width: "45vw",
                margin: "10px",
                  
              }}
            >
              <div style={{ display: "flex",
                alignItems: "center",   }}>
<img src={one} alt="" />
              <span style={{}}>在线问诊</span>
              </div>
              
            </Card>
            <Card
              style={{
                backgroundColor: "white",
                width: "45vw",
                
                margin: "10px",
                display: "flex",
                alignItems: "center",
                gap: 8,
              }}
            >
                  <div style={{ display: "flex",
                alignItems: "center",   }}>
<img src={two} alt="" />
              <span style={{}}>健康建档</span>
              </div>
            </Card>
          </div>
          <div
            style={{
              display: "flex",
              margin: "5px",
              alignItems:'center',
              justifyContent: "space-around",
            }}
          >
            <Card
              style={{               
                backgroundColor: "white",
                width: "45vw",
                margin: "10px",
                  
              }}
            >
              <div style={{ display: "flex",
                alignItems: "center"   }}>
           <img src={three} alt="" />
              <span style={{}}>用药建议</span>
              </div>
              
            </Card>
            <Card
              style={{
                backgroundColor: "white",
                width: "45vw",
               
                margin: "10px",
                display: "flex",
                alignItems: "center",
                gap: 8,
              }}
            >
                <div style={{ display: "flex",
                alignItems: "center"   }}>
                    <img src={four} alt="" />
              <span>优选订单</span>
                </div>
            
            </Card>
          </div>
         <div
            style={{
              display: "flex",
              margin: "5px",
              alignItems:'center',
              justifyContent: "space-around",
            }}
          >
            <Card
              style={{               
                backgroundColor: "white",
                width: "45vw",
                margin: "10px",
                  
              }}
            >
              <div style={{ display: "flex",
                alignItems: "center",   }}>
<img src={five} alt="" />
              <span style={{}}>我的医生</span>
              </div>
              
            </Card>
            <Card
              style={{
                backgroundColor: "white",
                width: "45vw",
                
                margin: "10px",
                display: "flex",
                alignItems: "center",
                gap: 8,
              }}
            >
                <div style={{ display: "flex",
                alignItems: "center"   }}>
                   <img src={six} alt="" />
              <span>随访计划</span>
                </div>
             
            </Card>
          </div>
        </ResultPage.Card>

        <List header="" style={{ marginTop: "220px" }}>
          <List.Item onClick={() => nav("/address")}>收货地址</List.Item>
          <List.Item onClick={() => nav("/card")}>我的卡券</List.Item>
          <List.Item onClick={() => nav("/yue")}>门诊预约</List.Item>
          <List.Item onClick={() => nav("/price")}>价格公示</List.Item>
          <List.Item onClick={() => nav("/idea")}>意见反馈</List.Item>
          <List.Item onClick={() => nav("/user")}>用户协议</List.Item>
          <List.Item onClick={() => nav("/about")}>关于我们</List.Item>
        </List>

        <p
          style={{
            textAlign: "center",
            position: "absolute",
            width: "100vw",
            fontSize: "12px",
            color: "#999999",
          }}
        >
          服务热线
          <a href="">400-078-1000</a>
        </p>
      </ResultPage>
    </div>
  );
}

export default Index;
